﻿@page
@using FDSimpleModelGenerator.Common.Mvc
@model CreateTableModel
@{
    ViewData["Title"] = "遊龍建表在线生成器";
    //var param = new ConfigSettingModel
    //{
    //    Database = "LanGuo",
    //    UserId = "sa",
    //    Password = "DX.net123!@#",
    //    ServerName = "192.168.50.79",
    //    TableName = "romOrder"
    //};
    //var param = new GenerateModel
    //{
    //    Database = "demo",
    //    Namespace = "FDSimpleModelGenerator.Demo",
    //    UserId = "root",
    //    Password = "1234",
    //    ServerName = "localhost",
    //    TableName = "user"
    //};
    //    var dataTypes = new List<SelectListItem>
    //{
    //        new SelectListItem("nvarchar", "nvarchar"),
    //        new SelectListItem("char", "char"),
    //        new SelectListItem("varchar", "varchar"),
    //        new SelectListItem("nchar", "nchar")
    //    };
    //    var dataTypes2 = new List<SelectItem>
    //{
    //        new SelectItem{ Id="int", Text="int"},
    //        new SelectItem{ Id="varchar", Text="varchar", MaxLength = 8000},
    //        new SelectItem{ Id="nvarchar", Text="nvarchar", MaxLength = 4000},
    //        new SelectItem{ Id="char", Text="char", MaxLength = 800},
    //    };
}
@section Styles{
    @Html.InclueCss("~/css/index.min.css")
    @*<link href="~/lib/select2/select2.min.css" rel="stylesheet" />*@
    <style>
        .main-config{
            border-radius: 10px;
        }
        #result {
            text-align: left;
            margin-bottom: 80px;
            width: 100%;
        }

            #result .item {
                margin-top: 20px;
            }

                #result .item .oper {
                    background: #6ea0de;
                    color: #fff;
                    padding: 5px;
                }

                    #result .item .oper a {
                        /*cursor: pointer;*/
                        margin-left: 10px;
                        color: #ffffff;
                        text-decoration: none;
                    }

                        #result .item .oper a:hover {
                            color: #ff8c00;
                        }

                #result .item .content {
                    background: #f8f9fa;
                    font-size: 14px;
                    font-family: arial;
                    padding-top: 15px;
                    padding-bottom: 15px;
                    padding-left: 5px;
                    padding-right: 20px;
                }

        .popover-body {
            color: #ff0000 !important;
        }
    </style>
}
@Html.AntiForgeryToken()
<div class="text-center">
    <div class="main-config row bg-info p-3">
        <div class="db-config col-md-5">
            <div class="row">
                <label class="col-md-3 text-light mt-2 text-right">库类型</label>
                <select name="DbType" class="form-control col-md-9" placeholder="请选择模型模板名称">
                    @foreach (var dbType in Model.DatabaseTypes)
                    {
                        <option value="@dbType.Value">@dbType.Name</option>
                    }
                </select>
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">服务器</label>
                <input class="col-md-9 form-control" type="text" id="txtServer" name="ServerName" placeholder="请输入服务器" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">端口</label>
                <input class="col-md-9 form-control" type="text" id="txtPort" name="Port" placeholder="请输入服务器端口" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">数据库</label>
                <input class="col-md-9 form-control" type="text" id="txtDatabase" name="Database" placeholder="请输入数据库" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">用户名</label>
                <input class="col-md-9 form-control" type="text" id="txtUserId" name="UserId" placeholder="请输入用户名" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">密码</label>
                <input class="col-md-9 form-control" type="password" id="txtPassword" name="Password" placeholder="请输入密码" value="" />
            </div>
        </div>
        <div class="model-config col-md-7">
            <div class="row">
                <label class="col-md-3 text-light mt-2 text-right">表名</label>
                <input class="col-md-9 form-control" type="text" id="txtTableName" name="TableName" placeholder="请输入表名，“,”分隔" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">表备注</label>
                <input class="col-md-9 form-control" type="text" id="txtTableRemark" name="Description" placeholder="请输入表备注" value="" />
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">执行创建</label>
                <input class="col-md-1 form-control" type="checkbox" id="txtExecuteSql" name="ExecuteSql" />
                <select name="CachedKey" class="form-control col-md-8" placeholder="选择缓存的配置"></select>
            </div>
            <div class="row mt-1">
                <label class="col-md-3 text-light mt-2 text-right">存在则删除</label>
                <input class="col-md-1 form-control" type="checkbox" id="txtDeleteExists" name="DeleteExists" />
                <select class="default-column-name-style mr-1 form-control col-md-3" name="DefaultColumnNameType">
                    <option value="0">默认配置命名</option>
                    <option value="1">首字母大写驼峰命名</option>
                    <option value="2">首字母小写驼峰命名</option>
                    <option value="3">蛇形命名</option>
                </select>
                <button class="btn btn-light add-col">+创建列</button><button class="btn btn-light ml-1 mod-col">+修改列</button><button class="btn btn-light ml-1 del-col">+删除列</button>
            </div>
            @*<div class="row">
                    <label class="col-md-2 text-light mt-2">模型模板</label>
                    <select name="TemplateName" class="form-control col-md-10" placeholder="请选择模型模板名称">
                        @foreach (var template in Model.Templates)
                        {
                            <option value="@template.Value">@template.Name</option>
                        }
                    </select>
                </div>*@
            @*<div class="row">
                    <label class="col-md-2 text-light mt-2">属性首字母</label>
                    <select name="FirstCharFormat" class="form-control col-md-10" placeholder="请选择属性首字母格式">
                        <option value="1">大写</option>
                        <option value="0">小写</option>
                    </select>
                </div>*@
            <div class="row">&nbsp;</div>
            <div class="row">
                <button class="col-md-2 offset-6 btn bg-warning text-light" id="btnSetConfig" data-container="body" data-toggle="popover" data-placement="bottom" data-content="">设置配置</button>
                <button class="col-md-2 offset-1 btn bg-primary mr-1 text-light" id="btnGenerate" data-container="body" data-toggle="popover" data-placement="bottom" data-content="">生成</button>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="db-table">
            <table class="table" id="tdata">
                <thead>
                    <tr class="row">
                        <th class="col-md-2">列名</th>
                        <th class="col-md-1">类型</th>
                        <th class="col-md-1">长度</th>
                        <th class="col-md-1">是否可空</th>
                        <th class="col-md-1">主键</th>
                        <th class="col-md-1">默认值</th>
                        <th class="col-md-1">自增量</th>
                        <th class="col-md-1">无符号</th>
                        <th class="col-md-2">备注</th>
                        <th class="col-md-1"></th>
                    </tr>
                </thead>
                <tbody class="tb-column">
                    <tr class="row" data-column="1">
                        <td class="col-md-2"><input name="ColumnName" class="form-control" placeholder="列名" /></td>
                        <td class="col-md-1"><input name="DataType" class="form-control" placeholder="数据类型" /></td>
                        <td class="col-md-1"><input name="Length" type="text" class="form-control" placeholder="长度,精度" title="长度,精度" /></td>
                        <td class="col-md-1"><input type="checkbox" name="AllowNulls" class="form-control" placeholder="是否可空" /></td>
                        <td class="col-md-1"><input type="checkbox" name="PrimaryKey" class="form-control" placeholder="主键" /></td>
                        <td class="col-md-1"><input name="DefaultValue" class="form-control" placeholder="默认值" /></td>
                        <td class="col-md-1"><input name="IncrementValue" type="number" class="form-control" placeholder="自增量" /></td>
                        <td class="col-md-1"><input type="checkbox" name="Unsigned" class="form-control" placeholder="无符号" /> </td>
                        <td class="col-md-2"><input name="Remark" class="form-control" placeholder="备注" /></td>
                        <td class="col-md-1">
                            <button type="button" class="close float-left" aria-label="关闭">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </td>
                    </tr>
                    <tr class="pd row">
                    </tr>
                </tbody>
                <tbody>
                    <tr class="bg-info text-white"><th>创建索引(回车新增一行)</th></tr>
                    <tr class="pad row">
                    </tr>
                    <tr class="row" data-column="2">
                        <td class="col-md-2"><input name="IndexName1" class="form-control" placeholder="列名1" /></td>
                        <td class="col-md-2"><input name="IndexName2" class="form-control" placeholder="列名2" /></td>
                        <td class="col-md-2"><input name="IndexName3" class="form-control" placeholder="列名3" /></td>
                        <td class="col-md-2"><input name="IndexName4" class="form-control" placeholder="列名4" /></td>
                        <td class="col-md-2"><input name="IndexName5" class="form-control" placeholder="列名5" /></td>
                        <td class="col-md-1"><input name="UniqueIndex" type="checkbox" class="form-control" placeholder="唯一索引" title="是否唯一索引" /></td>
                        <td class="col-md-1">
                            <button type="button" class="close float-left" aria-label="关闭">
                                <span aria-hidden="true">&times;</span>
                            </button>
                        </td>
                    </tr>
                </tbody>
            </table>
            @*<div class="row">
                    <label class="col-md-2 text-light">库类型</label>
                    <select name="DbType" class="form-control col-md-10" placeholder="请选择模型模板名称">
                        @foreach (var dbType in Model.DatabaseTypes)
                        {
                            <option value="@dbType.Value">@dbType.Name</option>
                        }
                    </select>
                </div>*@
        </div>
        <div class="row">
            <div id="result">
            </div>
        </div>
    </div>
</div>
@*@await Component.InvokeAsync("Hello")*@

<button id="btnShowUpload" class="d-none">Upload</button>
@*@await Component.InvokeAsync("Upload")*@

@section Scripts
    {
    @Html.InclueScript("~/lib/clipboard/clipboard.min.js")
    @Html.InclueScript("~/js/jquery.extend.js")
    @Html.InclueScript("~/lib/bootstrap/typeahead/bootstrap3-typeahead.min.js")
    @Html.InclueScript("~/lib/tablednd/jquery.tablednd.min.js")
    @Html.InclueScript("~/js/createtable.js")
    @*<script src="~/lib/select2/select2.min.js"></script>
        <script src="~/lib/select2/i18n/zh-CN.js"></script>*@
    @*<script src="~/lib/bootstrap/typeahead/typeahead.bundle.js"></script>*@
    <script>

    </script>
}
